<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Menangen | Как связаться со мной</title>

<style type="text/css">
HTML,BODY
		{
			/* [disabled]background:#000000; */
			background-color:#000000;
			font-family:Tahoma, Geneva, sans-serif;
			font-size:11px;
			height:100%;
			margin:0;
			padding:0;			/*color:#356075;#175675*/
			
		}
.info {
			margin-left: auto;
			margin-right: auto;
			width: 100%;
			top: 30px; position:relative;
			z-index: 12;		
					
}
.header_div {			
			height: 37px;
			width:auto;
			position:inherit;
			z-index: -1;
			
}

.main {
			margin-left:auto; margin-right:auto;
			border:3px solid #1035ba;
			border-radius: 20px;
			-webkit-border-radius: 20px;
			-moz-border-radius: 20px;
			width:720px;
			position:relative;
            padding-bottom: 30px;
			
			
}

.content_block {
			margin-left:auto; margin-right:auto;
			width:664px;
			margin-top: 12px;			
			/*background-color:#FFFFFF;*/
			padding: 1px;
			margin-bottom: 20px;
			margin-top: 20px;
			/*padding-bottom: 10px;
			padding-top: 10px;
			*/
}

.user_text_block {
			position:static;
			min-height: 120px;		
			background:url(../images/contact_container_bg.png);
			margin: 4px 10px;			
			/*border: 1px solid #132c39;*/
			
			
			
}
 

.nik_name
    {
			position:relative;
			float:left;
						
			width:20%;		
			

    }

.about_user {
			width:100px;height:100px;margin:-50px 0 0 -53px;
			top: 60px;
			left:50%;position:inherit;
			background-color:#000;
}

.nik {
			width:100px;height:10px;margin:-50px;top:50%;left:50%;position:relative;
			text-align:center;
			font-weight:bold;
			color:#1035ba;			
			
}

.nik_up {
			width:100%;height:100%; top:-5px; position:inherit;
}

.nik_time {
		
			position:absolute;
			top: 47px;
			text-align:center;
			font-size:10px;
			font-family:Tahoma, Geneva, sans-serif;
			
			color:#000;
			/*font-weight:normal;*/
			min-width:100px;
			margin-top: 1px;
}

.container {
			display: table-cell;
			vertical-align: middle; 
			height: 120px; width: auto;
			/*background:#000;*/
			margin: 10px;
	  
}
*+html .auxiliary {
			display: inline-block;
			vertical-align: middle;
			width: 0px; 
			height: 100%;
}
*+html .container div {
			display: inline-block;
			vertical-align: middle;		
			
}
*+html .container div, .auxiliary {
			display: inline;
}

.comment_block {
			border: 1px solid #5ea0c1;			
			margin: 10px;
			padding: 12px;
			font-family:Arial, Helvetica, sans-serif;
			font-size:12px;
			color:#FFF;
			min-width: 468px;
}

.comment_block A {
			color:#2458ff;
			font-weight:bold;
			text-decoration:none;
}

.comment_block A:hover {
			color:#000;
}

.send_form {
			background-color:#0a206f;
			min-height: 47px;
}

.answer_block {
			/*border: 1px solid #94d5f7;*/
			background:#000;
			margin: 0px 10px 10px;
			
			padding: 5px;			
			
			color:#1739a5;
			font-weight:bold;
			min-width: 468px;
}

.answer_nik {
						
			color:#5B9CFE;
}

.menan_nik {
			background:#1739a5;
			color:#000;
}

.menan_comment {
			color:#8A8A8A;
}

.to_answer_button {
			position:static;
			float:right;
			margin-right: 10px;
			margin-bottom: 8px;
			cursor: pointer;
			text-decoration:none;
			font-weight:bold;
			color:#0f374b;
			width: 80px;
			height: 31px;
			background:url(../images/button_answer_normal.png);
}

.to_answer_button:hover {
			background:url(../images/button_answer_over.png);
}

.to_answer_button:active {
			background:url(../images/button_answer_pressed.png);
}

.editorText {
			margin-left: 10px;
}
</style>

<script type="text/javascript" src="../js/dojo/dojo.js"></script>

<script type="application/javascript">
        editors = []

        require([ "dojo", "dijit/Editor", "dojo/domReady!"], function(dojo, Editor){
            // do something with app and dojo...
            //alert(dojo.version);
            window.Editor = Editor
            window.dojo = dojo

        });


		function send() {
			//.submit();
		}

        function create_comment(id) {


            // cursor
            dojo.byId("to_answer_form_block_" + id).style.cursor = "default";

            // visibility
            dojo.setStyle("to_answer_form_block_" + id, "visibility", "visible");
            // margin
            dojo.setStyle("to_answer_form_block_"+id, "marginTop", "50px");

            // Make our editor
            //newEditor = new dijit.Editor({height: "100px"},  dojo.byId("to_answer_form_block_" + id));
            newEditor = new Editor({
                        plugins: ["bold","italic","|","cut","copy","paste","|","insertUnorderedList"],
                        height: "100px"
                    },
                    dojo.byId("to_answer_form_block_" + id)
            );


            editors.push("to_answer_form_block_" + id);

            //alert(newEditor);

        };


		function destroyer() {

			dojo.forEach(editors, function(node) {
				//alert(node);

				//parent = dojo.byId(node).parent(".container");
				//console.debug(parent);

				dojo.destroy(dojo.byId(node));

                parent = node.parentNode;

				dojo.create("div", { id: "1st", class: "editorText" }, parent, "last");
			}
            );

			/*
			dojo.query(".container").forEach(function(node, index, arr){
				  dojo.create("div", { id: "1st", class: "editorText" }, node, "last");
			});*/



			editors = []


		}

</script>


<link rel="stylesheet" type="text/css" href="../js/dijit/themes/claro/claro.css">

</head>

<body class="claro">

<div style="height: 100%;">
	
    <div class="info">
            <div class="main">
                
                <div class="header_div"><img src="../images/contact_main_bg.png"></img></div>
             
                <div class="content_block">
                     <?py count = 0 ?>
                     

                     <?py for contact in data: ?>
                     <!-- Python block-->
                     <div class="user_text_block">
                     		
                            <div>
                            
                            	<div class="nik_name">

                                    <div class="about_user">
                                    	<div class="nik">
                                        	<div class="nik_up">${contact['name']}</div>
                                            <div class="nik_time">12:35|21.12.2010</div>
                                        </div>
                                    </div>
                                    
                                    
                                </div>
                                
      							<div class="container"> <!-- блок-контейнер -->
                                         <div class="comment_block"> <!-- блок с содержанием -->
                                         ${contact['commet']}
                                         </div>
                                     <div class="auxiliary">
                                     	
                                        <!--<div class="answer_block">
                                        	
                                            <span class="menan_nik">menangen:</span> <span class="menan_comment">Да, я посмотрю, конечно же!</span>
                                        
                                        </div>-->
                                     
                                     </div> <!-- пустой вспомогательный блок -->
                                     <div onClick="create_comment('#{contact['id']}')" class="to_answer_button">
                                     </div>
                                     
                                     <button value="Click" onClick="destroyer()">Click</button>

                                     <div class="editorText" id="to_answer_form_block_#{contact['id']}">

                                     
                                      </div>
                                </div>                      	
                            
                            </div>
                            
                     </div>
					<!---->
                    
                    <?py count += 1 ?>
                    <?py #endfor ?>

                    
                
                </div>
                
            </div> 
        
	</div>



</div>  

</body>
</html>